<template>
	<view class="module-section" v-if="isShow">
		<view class="module-section__bar">
			<view :class="['module-section__bar__title', isLineIcon ? 'line_icon' : '']">{{ moduleTitle }}</view>
			<slot name="replenish"></slot>
		</view>
		<view class="module-section__content">
			<slot name="content"></slot>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'moduleTravel',
		props: {
			isShow: {
				type: Boolean,
				default: true
			},
			isLineIcon: {
				type: Boolean,
				default: true
			},
			moduleTitle: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
	.module-section{
		margin-bottom: 20rpx;
		background: $uni-bg-color;
		&__bar{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 24rpx;
			border-bottom: 1rpx solid $uni-border-color;
			&__title{
				font-size: $uni-font-size-base;
				&.line_icon{
					&:before{
						content: "";
						display: inline-block;
						width: 6rpx;
						height: 28rpx;
						vertical-align: middle;
						margin: -6rpx 12rpx 0 0;
						background-color: $uni-bg-color-primary;
					}
				}
			}
		}
		&__content{
			
		}
	}
</style>
